<template>
	<view style="" class="content">
		<view style="width: 100%;padding: 25rpx;font-size: 34rpx;font-weight: bold;color: #191919;">
			群聊名称
		</view>
		<view style="width: 100%;padding: 25rpx;padding-top: 0rpx;">
			<u-input v-model="form.name" style="padding: 10rpx;" border></u-input>
		</view>
		<view style="width: 100%;padding: 25rpx;font-size: 34rpx;font-weight: bold;color: #191919;">
			群公告
		</view>
		<view style="width: 100%;padding: 25rpx;padding-top: 0rpx;">
			<u-input v-model="form.note" style="padding: 10rpx;" border></u-input>
		</view>

		<view style="width: 100%;padding: 25rpx;font-size: 34rpx;font-weight: bold;color: #191919;">
			入群方式
		</view>
		<view style="width: 100%;padding: 25rpx;padding-top: 0rpx;">
			<u-input v-model="form.entertype" style="padding: 10rpx;" type="select" @click="showentertype = true"
				border></u-input>
			<u-action-sheet :list="entertypelist" v-model="showentertype" @click="entertypechange"></u-action-sheet>
		</view>

		<view style="width: 100%;padding: 25rpx;font-size: 34rpx;font-weight: bold;color: #191919;">
			群状态
		</view>
		<view style="width: 100%;padding: 25rpx;padding-top: 0rpx;">
			<u-input v-model="form.status" style="padding: 10rpx;" type="select" @click="showstatus = true"
				border></u-input>
			<u-action-sheet :list="statuslist" v-model="showstatus" @click="statuschange"></u-action-sheet>
		</view>
		
		<view style="width: 100%;padding: 25rpx;padding-top: 0rpx;margin-top: 50rpx;">
			<u-button @click="changeconfirm" type="primary" style="height: 90rpx;">确认更改</u-button>
		</view>

	</view>
</template>

<script>
	import {
		mapState
	} from 'vuex';
	import {
		sub
	} from '../../common/event';
	export default {
		data() {
			return {
				id: '',
				user: {},
				form: {},
				showentertype: false,
				entertypelist: [{
					text: '自由进群'
				}, {
					text: '申请进群'
				}, {
					text: '禁止进群'
				}],
				showstatus: false,
				statuslist: [{
					text: '正常'
				}, {
					text: '禁言'
				}],

			}
		},
		onLoad({
			id
		}) {
			this.id = id
			this.user = this.$store.state.user.user
			this.getdata(id)
		},
		computed: {
			...mapState({
				info: function(state) {
					const ret = state.friend.list.find(e => e.gid == this.id)
					return ret
				},
				myself: function(state) {
					const ret = state.friend.list.find(e => e.gid == this.id)
					const myself = ret.users.find(e => e.uid == state.user.user.id)
					return myself
				},
				group: function(state) {
					const ret = state.friend.chatgroup.find(e => e.id == this.id)
					return ret
				}
			})
		},
		methods: {
			getdata: async function(id) {
				const ret = await this.$u.get(`bgyx/bgyx/getdata/chatgroup/${id}`)
				if (ret && ret.success) {
					this.form = ret.data
				}

			},
			entertypechange: function(e) {
				console.log(e)
				const entertype = this.entertypelist[e].text
				this.form.entertype = entertype
			},
			statuschange: function(e) {
				console.log(e)
				const status = this.statuslist[e].text
				this.form.status = status
			},
			changeconfirm: async function() {
				console.log(this.form)
				const ret = await this.$u.put(`friend/friend/changechargroupinfo`,this.form)
				if(ret && ret.success){
					uni.showToast({
						title:"修改成功",
					})
				}
				uni.navigateBack()
			},
		}
	}
</script>

<style scoped>
	.content {
		width: 100%;
		display: flex;
		flex-direction: column;
		align-items: center;
		background: #F3F3F3;
		height: 100vh;
		overflow-y: auto;
		padding: 10rpx;
	}
</style>